<template>
  <div class="mod-config">
    <el-card class="box-card">
      <div slot="header" class="choose_header">
        <span>阶段选择：  </span>
        <el-radio-group v-model="roleradio" style="margin-left: 10px;font-weight: 700">
          <el-radio :label="1" :disabled="!isAuth('project:project:plan')"><strong>项目安排</strong></el-radio>
          <el-radio :label="2" :disabled="!isAuth('project:work:list')"><strong>项目作业</strong></el-radio>
          <el-radio :label="3" :disabled="!isAuth('project:quality:list')"><strong>质量检查</strong></el-radio>
<!--          <el-radio :label="4" :disabled="!isAuth('project:quality:auth')">质量审核</el-radio>-->
          <el-radio :label="5" :disabled="!isAuth('project:checkoutput:list')"><strong>产值核算</strong></el-radio>
          <el-radio :label="6" :disabled="!isAuth('project:authorize:list')"><strong>项目审定</strong></el-radio>
          <el-radio :label="7" :disabled="!(isAuth('project:expach:save') || isAuth('project:authach:save'))"><strong>成果交接</strong></el-radio>
<!--          <el-radio :label="8" :disabled="!isAuth('project:innerFile:list')">档案对接</el-radio>-->
        </el-radio-group>
      </div>
      <el-form :inline="true" :model="dataForm" style="width: 100%;" size="mini">
        <el-select v-model="dataForm.dateItemId" placeholder="时间类型" style="width: 135px;" @change="getDataList"
                   class="select_btn" size="mini">
          <el-option v-for="item in dateItemList" :label="item.dateItem" :key="item.id" :value="item.id"></el-option>
        </el-select>
        <el-form-item style="margin-left: -2px;" size="mini">
          <el-date-picker v-model="dataForm.startDate"  type="date"  placeholder="开始日期" class="date_type" :picker-options="pickerOptionsStart" @change="changeEnd"></el-date-picker> 至
          <el-date-picker v-model="dataForm.endDate"  type="date"  placeholder="结束日期" class="date_type" :picker-options="pickerOptionsEnd" @change="changeStart"></el-date-picker>
        </el-form-item>
        <el-form-item size="mini">
          <el-select v-model="dataForm.projectType" placeholder="项目类型选择" filterable clearable @change="pageIndex = 1,getDataList()">
            <el-option v-for="item in projectTypeList"  :label="item.name" :key="item.id" :value="item.name"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item style="margin-left: 20px;">
          <el-input v-model="dataForm.key" placeholder="关键字搜索" clearable style="width: 140px;"  @change="pageIndex = 1,getDataList()"></el-input>
        </el-form-item>
        <el-form-item style="margin-left: -10px;" size="mini">
          <el-button @click="pageIndex = 1,getDataList()" plain type="primary" icon="el-icon-search">查询</el-button>
          <el-button @click="exportProjectExcel()" type="success" plain icon="el-icon-printer">导出Excel</el-button>
        </el-form-item>
        <el-form-item style="float: right" size="mini">
          <el-button @click="outputChartHandle" type="primary" icon="el-icon-s-data" v-if="isAuth('project:chartoutput')">产值表</el-button>
          <el-button @click="qualityChartHandle" type="primary" icon="el-icon-s-data" v-if="isAuth('project:chartquality')">质量表</el-button>
<!--          <el-button size="small" @click="collectChartHandle" type="primary" icon="el-icon-s-data" v-if="isAuth('project:chartcollect')">产值汇总表</el-button>-->
          <el-button @click="surveyChartHandle" type="primary" icon="el-icon-s-data" v-if="isAuth('project:chartsurvey')">满意调查表</el-button>
        </el-form-item>
      </el-form>
      <!--列表-->
      <el-table :data="dataList" border v-loading="dataListLoading" @sort-change="changeSort" stripe style="width: 100%;" size="mini"
                :header-cell-style="{background: 'steelblue',color:'white',padding:'0px'}" :cell-style="{padding:'0px'}">
        <el-table-column prop="projectNo" header-align="center" align="center" width="120" label="项目编号" sortable="custom" :sort-orders="['descending','ascending']">
          <template slot-scope="scope">
            <el-popover placement="right" width="240" trigger="hover" >
              <div class="pro_popover">
                <div>项目编号：<span>{{scope.row.projectNo}}</span></div>
                <div>项目启动时间：<span>{{scope.row.projectStartDateTime  == null?'-':scope.row.projectStartDateTime}}</span></div>
                <div>项目开工时间：<span>{{scope.row.projectBegunDateTime  == null?'-':scope.row.projectBegunDateTime.substring(0,10)}}</span></div>
                <div>作业完成时间：<span>{{scope.row.wFinishDateTime == null?'-':scope.row.wFinishDateTime.substring(0,10)}}</span></div>
                <div>质检完成时间：<span>{{scope.row.qFinishDateTime == null?'-':scope.row.qFinishDateTime.substring(0,10)}}</span></div>
                <div>结算时间：<span>{{scope.row.cutOffTime == null?'-':scope.row.cutOffTime.substring(0,7)}}</span></div>
                <div>作业工期：<span>{{scope.row.projectWorkDate == null?'-':scope.row.projectWorkDate}}</span></div>
                <div>质检工期：<span>{{scope.row.projectQualityDate == null?'-':scope.row.projectQualityDate}}</span></div>
                <div>返修天数：<span :style="scope.row.backDateNum>0?'color:red':''">{{scope.row.backDateNum == null?'-':scope.row.backDateNum}}</span></div>
                <div>暂停天数：<span :style="scope.row.suspendDay>0?'color:red':''">{{scope.row.suspendDay == null?'0':scope.row.suspendDay}}</span></div>
                <div>作业超时天数：<span :style="scope.row.woverTime>0 && scope.row.projectStatus != 1?'color:red':''">{{scope.row.woverTime == null || scope.row.projectStatus == 1?'-':scope.row.woverTime}}</span></div>
                <div>质检超时天数：<span :style="scope.row.qoverTime>0?'color:red':''">{{scope.row.qoverTime == null?'-':scope.row.qoverTime}}</span></div>
              </div>
              <span slot="reference" style="cursor: pointer">{{scope.row.projectNo}}</span>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column prop="projectName" header-align="center" align="left" label="项目名称" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column prop="projectAuthorize" header-align="center" align="center" label="委托单位" :show-overflow-tooltip="true"></el-table-column>
        <el-table-column prop="projectCharge" header-align="center" align="center" label="项目负责人" width="117" key="x" :sort-orders="['descending','ascending']" sortable="custom" v-if="roleradio<=5"></el-table-column>
        <el-table-column prop="qualityUserName" header-align="center" align="center" label="质检人员" width="117" key="y" :sort-orders="['descending','ascending']" sortable="custom" v-if="roleradio>5"></el-table-column>
        <el-table-column prop="projectStatus" header-align="center" align="center" label="项目状态" width="107" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.projectStatus === 0" size="small" type="primary">启动</el-tag>
            <el-popover v-else-if="scope.row.projectStatus === 1" placement="right" width="240" trigger="hover" >
              <div style="background-color:#f0f0f0;color: #00a0e9;border:1px solid #5daf34">
                <div>暂停缘由:<span style="color: red">{{scope.row.suspendExcuse}}</span></div>
                <div>暂停时间:<span style="color: red">{{scope.row.suspendTime}}</span></div>
              </div>
              <span slot="reference" style="cursor: pointer"><el-tag size="small" type="danger">暂停</el-tag></span>
            </el-popover>
          </template>
        </el-table-column>
        <el-table-column key="a"  prop="isPlan" header-align="center" align="center" label="安排情况" width="105" v-if="roleradio===1" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.isPlan == 1" size="small" type="success">已安排</el-tag>
            <el-tag  v-if="scope.row.isPlan != 1" size="small" type="info">未安排</el-tag>
          </template>
        </el-table-column>
        <el-table-column key="b"  prop="isWork" header-align="center" align="center" label="作业情况" width="105" v-if="roleradio===2" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope" >
            <el-tag v-if="scope.row.isWork === 1" size="small" type="success">已作业</el-tag>
            <el-tag v-else-if="scope.row.isWork === 2" size="small" type="danger">返修中</el-tag>
            <el-tag v-else size="small" type="info">未作业</el-tag>
          </template>
        </el-table-column>
        <el-table-column key="c"  prop="isCheck" header-align="center" align="center" label="质检情况" width="105" v-if="roleradio===3" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope" >
            <el-tag v-if="scope.row.isCheck == 1" size="small" type="success">已质检</el-tag>
            <el-tag v-else-if="scope.row.isCheck === 2" size="small" type="danger">返修中</el-tag>
            <el-tag v-else-if="scope.row.isCheck === 3" size="small" type="primary">返修完成</el-tag>
            <el-tag v-else-if="scope.row.isCheck === 4" size="small" type="warning">已收成果</el-tag>
            <el-tag v-else size="small" type="info">未质检</el-tag>
          </template>
        </el-table-column>
        <el-table-column key="d"  prop="isQauth" header-align="center" align="center" label="质审情况" width="105" v-if="roleradio===4" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope" >
            <el-tag v-if="scope.row.isQauth == 1" size="small" type="success">已质审</el-tag>
            <el-tag v-else size="small" type="info">未质审</el-tag>
          </template>
        </el-table-column>
        <el-table-column key="e" prop="isOutput" header-align="center" align="center" label="核算情况" width="105" v-if="roleradio===5" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.isOutput == 1" size="small" type="success">已核算</el-tag>
            <el-tag v-if="scope.row.isOutput != 1" size="small" type="info">未核算</el-tag>
          </template>
        </el-table-column>
        <el-table-column key="f"  prop="isAuthorize" header-align="center" align="center" label="审核情况" width="105" v-if="roleradio===6" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.isAuthorize === 1" size="small" type="success">已审核</el-tag>
            <el-tag v-else size="small" type="info">未审核</el-tag>
          </template>
        </el-table-column>
        <el-table-column key="g"  prop="isSach" header-align="center" align="center" label="提交成果" width="105" v-if="roleradio===7" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope" >
            <el-tag v-if="scope.row.isSach == 1" size="small" type="success">已提交</el-tag>
            <el-tag v-else size="small" type="info">未提交</el-tag>
          </template>
        </el-table-column>
        <el-table-column key="h"  prop="isAach" header-align="center" align="center" label="成果确认" width="105" v-if="roleradio===7" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope" >
            <el-tag v-if="scope.row.isAach == 1" size="small" type="success">已确认</el-tag>
            <el-tag v-else size="small" type="info">未确认</el-tag>
          </template>
        </el-table-column>
        <el-table-column key="j"  prop="isSign" header-align="center" align="center" label="客户签收" width="105" v-if="roleradio===7" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope" >
            <el-tag v-if="scope.row.isSign == 1" size="small" type="success">已签收</el-tag>
            <el-tag v-else size="small" type="info">未签收</el-tag>
<!--            <el-steps :active="1" simple size="mini"  style="font-size: 9pt;">-->
<!--              <el-step title="步骤 1" icon="el-icon-edit"></el-step>-->
<!--              <el-step title="步骤 2" icon="el-icon-upload"></el-step>-->
<!--              <el-step title="步骤 3" icon="el-icon-picture" description="这是一段很长很长很长的描述性文字"></el-step>-->
<!--            </el-steps>-->
          </template>
        </el-table-column>
        <el-table-column prop="scheduleRate" header-align="center" align="center" width="105" label="项目进度" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope">
            <!--是作业人员则添加 进度-->
            <div v-if="roleradio==2 && scope.row.isCharge == 1" @click="setScheduleHandle(scope.row)">
              <el-progress class="proclass" :text-inside="true" :stroke-width="22"
                           :percentage="scope.row.scheduleRate != null? scope.row.scheduleRate : 0">
              </el-progress>
            </div>
            <!--非作业人员则查看 进度-->
            <div v-else @click="getScheduleHandle(scope.row)">
              <el-progress class="proclass" :text-inside="true" :stroke-width="22"
                           :percentage="scope.row.scheduleRate != null? scope.row.scheduleRate : 0">
              </el-progress>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="projectStartDateTime" header-align="center" align="center" width="129" label="项目启动时间"
                         v-if="dataForm.dateItemId == 0" :sort-orders="['descending','ascending']" sortable="custom">

        </el-table-column>
        <el-table-column prop="projectBegunDateTime" header-align="center" align="center" width="129" label="项目开工时间"
                         v-if="dataForm.dateItemId == 1" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope">{{scope.row.projectBegunDateTime!= null? scope.row.projectBegunDateTime.substring(0,10) : ''}}
          </template>
        </el-table-column>
        <el-table-column prop="wFinishDateTime" header-align="center" align="center" width="129" label="作业完成时间"
                         v-if="dataForm.dateItemId == 2" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope">{{scope.row.wFinishDateTime != null? scope.row.wFinishDateTime.substring(0,10) : ''}}
          </template>
        </el-table-column>
        <el-table-column prop="qFinishDateTime" header-align="center" align="center" width="129" label="质检完成时间"
                         v-if="dataForm.dateItemId == 3" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope">{{scope.row.qFinishDateTime!= null? scope.row.qFinishDateTime.substring(0,10) : ''}}
          </template>
        </el-table-column>
        <el-table-column prop="cutOffTime" header-align="center" align="center" width="129" label="结算时间"
                         v-if="dataForm.dateItemId == 4" :sort-orders="['descending','ascending']" sortable="custom">
          <template slot-scope="scope">{{scope.row.cutOffTime != null? scope.row.cutOffTime.substring(0,7) : ''}}
          </template>
        </el-table-column>
        <el-table-column key="t" header-align="center" align="center" width="60" label="附件">
          <template slot-scope="scope">
            <el-button type="text" plain size="mini" v-if="scope.row.attachFilename" @click="lookoverFile(scope.row.attachFilename)">查看</el-button>
          </template>
        </el-table-column>
        <!--项目安排按钮-->
        <el-table-column :key="Math.random()"  header-align="center" align="center" width="100" label="操作"  v-if="roleradio==1">
          <template slot-scope="scope">
            <el-tooltip class="item" content="编辑安排" placement="left-start">
              <el-button type="primary" size="mini" icon="el-icon-edit" @click="editProjectHandle(scope.row)" v-if="isAuth('project:project:plan')"></el-button>
            </el-tooltip>
          </template>
        </el-table-column>
        <!--项目作业按钮-->
        <el-table-column :key="Math.random()"  header-align="center" align="center" width="240" label="操作" v-if="roleradio==2">
          <template slot-scope="scope">
            <el-tooltip class="item"  content="编辑工作" placement="left-start" v-if="scope.row.isCharge === 1">
              <el-button type="success" size="mini" icon="el-icon-edit" @click="editWorkHandle(scope.row)" v-if="isAuth('project:work:update')"></el-button>
            </el-tooltip>
            <el-tooltip class="item"  content="任务单打印" placement="left-start">
              <el-button type="success" size="mini" icon="el-icon-printer" @click="printWorkHandle(scope.row)" v-if="isAuth('project:work:print')"></el-button>
            </el-tooltip>
            <el-tooltip class="item"  :content="scope.row.projectStatus === 0? '暂停项目' : '启动项目'" placement="left-start" v-if="scope.row.isCharge === 1">
              <el-button :type="scope.row.projectStatus === 0? 'danger' : 'success'" size="mini" icon="el-icon-refresh-left" @click="stopProjectHandle(scope.row)" v-if="isAuth('project:work:list')">
              </el-button>
            </el-tooltip>
            <el-tooltip class="item"  content="查看返修" placement="left-start" v-if="scope.row.submitNote == null && scope.row.backId != null & scope.row.isCharge === 1" >
              <el-button type="warning" size="mini" icon="el-icon-s-tools" @click="setBackworkHandle(scope.row,true)" >
              </el-button>
            </el-tooltip>
          </template>
        </el-table-column>
        <!--质量检查按钮-->
        <el-table-column :key="Math.random()"  header-align="center" align="center" width="188" label="操作" v-if="roleradio==3">
          <template slot-scope="scope">
            <el-tooltip class="item"  content="编辑质检" placement="left">
              <el-button class="quality_btn" size="mini" icon="el-icon-edit-outline" @click="editQualityHandle(scope.row)" v-if="isAuth('project:quality:update')"></el-button>
            </el-tooltip>
            <el-tooltip class="item"  content="质检单打印" placement="left">
              <el-button class="quality_btn" size="mini" icon="el-icon-printer" @click="printCheckHandle(scope.row)" v-if="isAuth('project:check:print')"></el-button>
            </el-tooltip>
            <el-tooltip class="item"  content="查看返修" placement="left-start" v-if="scope.row.backId != null">
              <el-button class="quality_btn" size="mini" icon="el-icon-s-tools" @click="setBackworkHandle(scope.row,false)" >
              </el-button>
            </el-tooltip>
          </template>
        </el-table-column>
        <!--质量审核按钮-->
<!--        <el-table-column :key="Math.random()"  header-align="center" align="center" width="100" label="操作" v-if="roleradio==4">-->
<!--          <template slot-scope="scope">-->
<!--            <el-tooltip class="item" content="编辑质量审核" placement="left">-->
<!--              <el-button class="qualityauth_btn" size="mini" icon="el-icon-edit-outline" @click="editQualityAuthHandle(scope.row)"-->
<!--                         v-if="isAuth('project:quality:auth') && scope.row.isCheck == 1"></el-button>-->
<!--            </el-tooltip>-->
<!--          </template>-->
<!--        </el-table-column>-->
        <!--产值核算按钮-->
        <el-table-column :key="Math.random()"  header-align="center" align="center" width="100" label="操作" v-if="roleradio==5">
          <template slot-scope="scope">
            <el-tooltip class="item" content="编辑核算" placement="left">
              <el-button class="output_btn" size="mini" icon="el-icon-edit-outline" @click="editOutputHandle(scope.row)" v-if="isAuth('project:checkoutput:update')"></el-button>
            </el-tooltip>
          </template>
        </el-table-column>
        <!--项目审定按钮-->
        <el-table-column :key="Math.random()"  header-align="center" align="center" width="190" label="操作" v-if="roleradio==6">
          <template slot-scope="scope">
            <el-tooltip class="item" content="编辑审定" placement="left">
              <el-button class="examine_btn" size="mini" icon="el-icon-edit-outline"
                         @click="editExamineHandle(scope.row)" v-if="isAuth('project:authorize:update')"></el-button>
            </el-tooltip>
            <el-tooltip class="item" content="流程单打印" placement="left">
              <el-button class="examine_btn" size="mini" icon="el-icon-printer" @click="printProjectHandle(scope.row)" v-if="isAuth('project:authorize:print')"></el-button>
            </el-tooltip>
          </template>
        </el-table-column>
        <!--成果对接按钮-->
        <el-table-column :key="Math.random()"  header-align="center" align="center" width="90" label="操作" v-if="roleradio==7">
          <template slot-scope="scope">
            <el-tooltip class="item" content="编辑成果" placement="left">
              <el-button class="expach_btn" size="mini" icon="el-icon-edit-outline"
                         @click="expAchHandle(scope.row)"></el-button>
            </el-tooltip>
          </template>
        </el-table-column>
<!--        &lt;!&ndash;档案对接按钮&ndash;&gt;-->
<!--        <el-table-column :key="Math.random()"  header-align="center" align="center" width="90" label="操作" v-if="roleradio==8">-->
<!--          <template slot-scope="scope">-->
<!--            <el-tooltip class="item" content="编辑档案" placement="left">-->
<!--              <el-button class="filarch_btn" size="mini" icon="el-icon-edit-outline"-->
<!--                         @click="innerFileHandle(scope.row)"></el-button>-->
<!--            </el-tooltip>-->
<!--          </template>-->
<!--        </el-table-column>-->
      </el-table>
      <el-pagination
        @size-change="sizeChangeHandle"
        @current-change="currentChangeHandle"
        :current-page="pageIndex"
        :page-sizes="[25, 50, 100]"
        :page-size="pageSize"
        :total="totalPage"
        layout="total, sizes, prev, pager, next, jumper">
      </el-pagination>

      <!--项目进度表-->
      <el-dialog :title="scheduleTip" :visible.sync="scheduleDialogVisible">
        <el-table :data="scheduleList">
          <el-table-column prop="createTime" header-align="center" align="center" label="日期"
                           width="150"></el-table-column>
          <el-table-column prop="scheduleRate" header-align="center" align="center" label="进度比率"
                           width="100"></el-table-column>
          <el-table-column prop="scheduleNote" header-align="center" align="center" label="进度内容"></el-table-column>
        </el-table>
        <span slot="footer" class="dialog-footer">
        <el-button @click="scheduleDialogVisible = false" type="primary" plain>返回</el-button>
      </span>
      </el-dialog>

      <!--暂停缘由填写-->
      <el-dialog :title="'暂停缘由 (项目编号:' + selectedItem.projectNo + ')'"   :visible.sync="suspendVisible" >
        <el-input v-model="suspendExcuse" placeholder="请填写暂停的缘由" type="textarea"></el-input>
        <span slot="footer" class="dialog-footer">
          <el-button @click="suspendVisible = false" >取消</el-button>
          <el-button @click="updateStatusHandle(selectedItem)" type="primary">确定</el-button>
        </span>
      </el-dialog>

    </el-card>
    <!-- 弹窗, 新增 / 修改  项目组-->
    <projectschedule-add-or-update v-if="projectscheduleVisible" ref="projectscheduleAddOrUpdate"
                                   @refreshDataList="getDataList"></projectschedule-add-or-update>
    <!-- 弹窗, 新增 / 修改  返修-->
    <backwork-add-or-update v-if="backworkVisible" ref="backworkAddOrUpdate"
                            @refreshDataList="getDataList"></backwork-add-or-update>
    <!-- 弹窗, 新增 / 修改  导出excel-->
    <project-excel v-if="excelVisible" ref="projectExcel"></project-excel>
  </div>
</template>

<script>
  import moment from 'moment'
  import projectscheduleAddOrUpdate from './projectschedule-add-or-update'
  import backworkAddOrUpdate from './backwork-add-or-update'
  import projectExcel from './project-excel'
  import {isAuth, stringIsNull} from '@/utils'

  export default {
    data () {
      return {
        pickerOptionsStart: {},
        pickerOptionsEnd: {},
        projectscheduleVisible: false,
        backworkVisible: false,
        suspendVisible: false,  // 暂停项目窗口
        excelVisible: false,  // 导出excel窗口
        dateItemList: [], // 时间类型列表
        backWorkList: [], // 返修列表
        reportVisible: false, // 返修报告弹出窗
        reportTitle: '',  // 报告标题
        dataForm: {
          dateItemId: 0,
          key: '',
          sidx: 'id',
          order: 'desc',
          projectType: '',
          startDate: '',
          endDate: ''
        },
        projectTypeList: [],  // 项目类型列表
        roleradio: 0,
        dataList: [],
        pageIndex: 1,
        pageSize: 25,
        totalPage: 0,
        dataListLoading: false,
        dataListSelections: [],
        addOrUpdateVisible: false,
        projectAddOrUpdateVisible: false,
        scheduleDialogVisible: false,  // 项目进度表
        scheduleTip: '',
        scheduleList: [],
        allocationVisible: false,  // 项目安排
        suspendExcuse: '',    // 暂停缘由
        selectedItem: '' // 暂停选中的项目
      }
    },
    components: {
      projectscheduleAddOrUpdate,
      backworkAddOrUpdate,
      projectExcel
    },
    computed: {
      argsPageIndex: {
        get () { return this.$store.state.paramsutil.argsPageIndex },
        set (val) { this.$store.commit('paramsutil/updateargsPageIndex', val) }
      },
      argsPageSize: {
        get () { return this.$store.state.paramsutil.argsPageSize },
        set (val) { this.$store.commit('paramsutil/updateargsPageSize', val) }
      }
    },
    created () {
      this.dateItemList = [{'id': 0, 'dateItem': '项目启动时间'},
        {'id': 1, 'dateItem': '项目开工时间'},
        {'id': 2, 'dateItem': '作业完成时间'},
        {'id': 3, 'dateItem': '质检完成时间'},
        {'id': 4, 'dateItem': '结算时间'}]
      this.pageIndex = 1
      this.pageSize = 25
      // 角色选择初始化
      if (isAuth('project:authorize:list')) this.roleradio = 6
      if (isAuth('project:checkoutput:list')) this.roleradio = 5
      if (isAuth('project:quality:auth')) this.roleradio = 4
      if (isAuth('project:quality:list')) this.roleradio = 3
      if (isAuth('project:work:list')) this.roleradio = 2
      if (isAuth('project:project:plan')) this.roleradio = 1
      if (this.$cookie.get('jxrole') !== null && this.$cookie.get('jxrole') !== '') this.roleradio = parseInt(this.$cookie.get('jxrole'))
      if (this.$cookie.get('jxstartDate') !== null && this.$cookie.get('jxstartDate') !== '') {
        this.dataForm.startDate = new Date(this.$cookie.get('jxstartDate'))
        this.changeEnd()
      } else {
        this.dataForm.startDate = new Date(new Date().getFullYear(), new Date().getMonth() - 1, 1)
        this.changeEnd()
      }
      if (this.$cookie.get('jxendDate') !== null && this.$cookie.get('jxendDate') !== '') {
        this.dataForm.endDate = new Date(this.$cookie.get('jxendDate'))
        this.changeStart()
      } else {
        this.dataForm.endDate = new Date(new Date().getFullYear(), new Date().getMonth() + 1, 0)
        this.changeStart()
      }
      this.getDataList()
      this.getProjectTypeList()
    },
    methods: {
      // 排序字段改变
      changeSort (val) {
        console.log(val)
        switch (val.order) {
          case 'ascending':
            this.dataForm.order = 'asc'
            break
          case 'descending':
            this.dataForm.order = 'desc'
            break
          default:
            this.dataForm.order = 'desc'
        }
        if (val.prop === 'projectNo') {
          this.dataForm.sidx = 'id'
        } else {
          this.dataForm.sidx = val.prop
        }
        this.getDataList()
      },
      // 获取数据列表
      getDataList () {
        let startDate = ''
        let endDate = ''
        if (this.dataForm.startDate != null) startDate = moment(new Date(this.dataForm.startDate)).format('YYYY-MM-DD')
        if (this.dataForm.endDate != null) endDate = moment(new Date(this.dataForm.endDate)).format('YYYY-MM-DD')
        this.dataListLoading = true
        if (!stringIsNull(this.argsPageIndex)) {
          this.pageIndex = this.argsPageIndex
        }
        if (!stringIsNull(this.argsPageSize)) {
          this.pageSize = this.argsPageSize
        }
        this.$http({
          url: this.$http.adornUrl('/project/manage/page'),
          method: 'get',
          params: this.$http.adornParams({
            'page': this.pageIndex,
            'limit': this.pageSize,
            'key': this.dataForm.key,
            'sidx': this.dataForm.sidx,
            'order': this.dataForm.order,
            'projectType': this.dataForm.projectType,
            'startDate': startDate,
            'endDate': endDate,
            'dateItemId': this.dataForm.dateItemId
          })
        }).then(({data}) => {
          this.argsPageIndex = ''
          this.argsPageSize = ''
          if (data && data.code === 0) {
            console.log(data)
            this.dataList = data.page.list
            this.totalPage = data.page.totalCount
            // 计算 质检 和 作业超时时间
            for (let pro of this.dataList) {
              pro.backDateNum = pro.backDateNum === null ? 0 : pro.backDateNum
              pro.suspendDay = pro.suspendDay === null ? 0 : pro.suspendDay
              // 如果项目在暂停阶段 则当前时间 减去 暂停时间为 暂停时间
              if (pro.projectStatus === 1) {
                pro.suspendDay = parseInt((new Date() - new Date(pro.suspendTime)) / (24 * 60 * 60 * 1000)) + pro.suspendDay
              }
              // 开工时间为空
              if (pro.projectBegunDateTime == null) {
                pro.woverTime = null
                pro.qoverTime = null
              } else if (pro.isPlan === 1) {   // 项目已经安排
                // 作业时间为空 工作时间 为当前时间
                if (pro.wFinishDateTime === null) {
                  let woverTime = (parseInt((new Date() - new Date(pro.projectBegunDateTime)) / (12 * 60 * 60 * 1000)) * 0.5
                    - Math.ceil(pro.projectWorkDate * 1.5 * 2) * 0.5 + pro.backDateNum - pro.suspendDay).toFixed(1)
                  pro.woverTime = woverTime < 0 ? 0 : woverTime
                  pro.qoverTime = null
                } else {
                  let woverTime = (parseInt((new Date(pro.wFinishDateTime) - new Date(pro.projectBegunDateTime)) / (12 * 60 * 60 * 1000)) * 0.5
                    - Math.ceil(pro.projectWorkDate * 1.5 * 2) * 0.5 + pro.backDateNum - pro.suspendDay).toFixed(1)
                  pro.woverTime = woverTime < 0 ? 0 : woverTime
                  // 质检时间为空 质检时间 为当前时间
                  if (pro.qFinishDateTime === null) {
                    let qoverTime = (parseInt((new Date() - new Date(pro.wFinishDateTime)) / (12 * 60 * 60 * 1000))) * 0.5 - Math.ceil(pro.projectQualityDate * 3) * 0.5
                    pro.qoverTime = qoverTime < 0 ? 0 : qoverTime
                  } else {
                    let qoverTime = (parseInt((new Date(pro.qFinishDateTime) - new Date(pro.wFinishDateTime)) / (12 * 60 * 60 * 1000))) * 0.5 - Math.ceil(pro.projectQualityDate * 3) * 0.5
                    pro.qoverTime = qoverTime < 0 ? 0 : qoverTime
                  }
                }
              }
            }
          } else {
            this.dataList = []
            this.totalPage = 0
            this.$message.error(data.msg)
          }
          this.dataListLoading = false
        })
      },
      // 同步获取 项目类型列表数据
      getProjectTypeList () {
        return new Promise((resolve, reject) => {
          this.$http({
            url: this.$http.adornUrl('/set/projecttype/selectprojecttype'),
            method: 'get'
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.projectTypeList = data.list
              resolve(data.list)
            } else {
              this.dataList = []
            }
          })
        })
      },
      // 改变开始时间
      changeStart () {
        if (this.dataForm.endDate === null || this.dataForm.endDate === '') {
          this.$cookie.set('jxendDate', '')
        } else {
          this.$cookie.set('jxendDate', moment(new Date(this.dataForm.endDate)).format('YYYY-MM-DD'))
        }
        this.pickerOptionsStart = Object.assign({}, this.pickerOptionsStart, {
          disabledDate: (time) => {
            return time.getTime() > this.dataForm.endDate
          }
        })
        // this.pageIndex = 1
        // this.getDataList()
      },
      // 改变结束时间
      changeEnd () {
        if (this.dataForm.startDate === null || this.dataForm.startDate === '') {
          this.$cookie.set('jxstartDate', '')
        } else {
          this.$cookie.set('jxstartDate', moment(new Date(this.dataForm.startDate)).format('YYYY-MM-DD'))
        }
        console.log(this.$cookie.get('jxstartDate'))
        this.pickerOptionsEnd = Object.assign({}, this.pickerOptionsEnd, {
          disabledDate: (time) => {
            return time.getTime() < this.dataForm.startDate
          }
        })
        // this.pageIndex = 1
        // this.getDataList()
      },
      // 每页数
      sizeChangeHandle (val) {
        this.pageSize = val
        this.pageIndex = 1
        this.getDataList()
      },
      // 当前页
      currentChangeHandle (val) {
        this.pageIndex = val
        this.getDataList()
      },
      // 获取进度列表
      getScheduleHandle (item) {
        let projectNo = item.projectNo
        this.scheduleDialogVisible = true
        this.scheduleTip = '项目进度表（编号：' + projectNo + ')'
        this.dataListLoading = true
        this.$http({
          url: this.$http.adornUrl('/project/schedule/list'),
          method: 'get',
          params: this.$http.adornParams({
            'projectNo': projectNo
          })
        }).then(({data}) => {
          if (data && data.code === 0) {
            this.scheduleList = data.list
          } else {
            this.scheduleList = []
          }
          this.dataListLoading = false
        })
      },
      // 查看合同附件
      lookoverFile (filename) {
        window.open(window.SITE_CONFIG['uploadUrl'] + 'contract/' + filename )
      },
      // 查看质检反馈内容
      checkReportHandle (item) {
        this.reportVisible = true
        this.reportTitle = '质检反馈报告（ 时间：' + item.backCreateTime + ')'
        this.$refs.reportId.innerHTML = item.backNote
      },
      // 提交进度
      setScheduleHandle (item) {
        // 项目作业已提交，就无法提交进度
        if (item.isWork === 1) {
          this.$message.error('当前项目已作业完成，无法添加进度！')
          return
        }
        // 项目质检已提交，就无法提交进度
        if (item.isCheck === 1) {
          this.$message.error('当前项目已质检完成，无法添加进度！')
          return
        }
        this.projectscheduleVisible = true
        this.$nextTick(() => {
          this.$refs.projectscheduleAddOrUpdate.init(item)
        })
      },
      // 返修内容（isEdit 为true 可编辑返修）
      setBackworkHandle (item, isEdit = true) {
        this.backworkVisible = true
        this.$nextTick(() => {
          this.$refs.backworkAddOrUpdate.init(item.projectNo, isEdit)
        })
      },
      // 编辑安排
      editProjectHandle (item) {
        this.$cookie.set('jxrole', this.roleradio)
        this.$router.push({path: '/project-editallocation',
          query: {projectNo: item.projectNo, pageIndex: this.pageIndex, pageSize: this.pageSize}
        })
      },
      // 编辑工作
      editWorkHandle (item) {
        this.$cookie.set('jxrole', this.roleradio)
        if (item.scheduleRate < 90) {
          this.$message({
            message: '项目进度需达到90%以上才能进行编辑，请添加进度后再进行作业编辑',
            type: 'error',
            duration: 2500
          })
          return
        }
        if (item.isWork === 2) {
          this.$message({
            message: '当前项目处于返修状态，请添加修改说明后方可编辑。',
            type: 'error',
            duration: 2500
          })
          return
        }
        this.$router.push({path: '/project-editwork',
          query: {projectNo: item.projectNo, pageIndex: this.pageIndex, pageSize: this.pageSize}
        })
      },
      // 作业任务单打印
      printWorkHandle (item) {
        this.$cookie.set('jxrole', this.roleradio)
        this.$router.push({path: '/project-printwork',
          query: {projectNo: item.projectNo, pageIndex: this.pageIndex, pageSize: this.pageSize}
        })
      },
      // 质检单打印
      printCheckHandle (item) {
        this.$cookie.set('jxrole', this.roleradio)
        this.$router.push({path: '/project-printcheck',
          query: {projectNo: item.projectNo, pageIndex: this.pageIndex, pageSize: this.pageSize}
        })
      },
      // 任务流程单打印
      printProjectHandle (item) {
        this.$cookie.set('jxrole', this.roleradio)
        this.$router.push({path: '/project-printproject',
          query: {projectNo: item.projectNo, pageIndex: this.pageIndex, pageSize: this.pageSize}
        })
      },
      // 编辑质量检查
      editQualityHandle (item) {
        this.$cookie.set('jxrole', this.roleradio)
        if (item.isWork !== 1) {
          this.$confirm('当前项目作业未完成, 是否继续质检?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.$router.push({path: '/project-editquality',
              query: {projectNo: item.projectNo, pageIndex: this.pageIndex, pageSize: this.pageSize}
            })
          })
        } else {
          this.$router.push({path: '/project-editquality',
            query: {projectNo: item.projectNo, pageIndex: this.pageIndex, pageSize: this.pageSize}
          })
        }
      },
      // 编辑质量审核
      editQualityAuthHandle (item) {
        this.$cookie.set('jxrole', this.roleradio)
        this.$router.push({path: '/project-editqualityauth',
          query: {projectNo: item.projectNo, pageIndex: this.pageIndex, pageSize: this.pageSize}
        })
      },
      // 编辑产值核算
      editOutputHandle (item) {
        this.$cookie.set('jxrole', this.roleradio)
        this.$router.push({path: '/project-editoutput',
          query: {projectNo: item.projectNo, pageIndex: this.pageIndex, pageSize: this.pageSize}
        })
      },
      // 编辑项目审定
      editExamineHandle (item) {
        this.$cookie.set('jxrole', this.roleradio)
        this.$router.push({path: '/project-editauthorize',
          query: {projectNo: item.projectNo, pageIndex: this.pageIndex, pageSize: this.pageSize}
        })
      },
      // 编辑成果
      expAchHandle (item) {
        this.$cookie.set('jxrole', this.roleradio)
        this.$router.push({path: '/project-editexpach',
          query: {projectNo: item.projectNo, pageIndex: this.pageIndex, pageSize: this.pageSize}
        })
      },
      // 编辑档案对接
      innerFileHandle (item) {
        this.$cookie.set('jxrole', this.roleradio)
        this.$router.push({path: '/file-innerFile',
          query: {projectNo: item.projectNo, pageIndex: this.pageIndex, pageSize: this.pageSize}
        })
      },
      // 产值统计表
      outputChartHandle () {
        this.$router.push({path: '/project-chartoutput'})
      },
      // 产值汇总统计表
      collectChartHandle () {
        this.$router.push({path: '/project-chartcollect'})
      },
      // 质量统计表
      qualityChartHandle () {
        this.$router.push({path: '/project-chartquality'})
      },
      // 满意度调查表
      surveyChartHandle () {
        this.$router.push({path: '/project-chartsurvey'})
      },
      // 暂停或启动项目
      stopProjectHandle (item) {
        this.suspendExcuse = ''
        if (item.projectStatus === 0) {
          this.suspendVisible = true
          this.selectedItem = item
        } else {
          this.updateStatusHandle(item)
        }
      },
      // 暂停请求事件
      updateStatusHandle (item) {
        this.$http({
          url: this.$http.adornUrl(`/project/work/updateStatus`),
          method: 'post',
          data: this.$http.adornData({
            'id': item.id,
            'projectNo': item.projectNo,
            'projectStatus': item.projectStatus === 0 ? 1 : 0,
            'suspendExcuse': this.suspendExcuse
          })
        }).then(({data}) => {
          if (data && data.code === 0) {
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500
            })
            this.suspendVisible = false
            this.getDataList()
          } else {
            this.$message.error(data.msg)
          }
        })
      },
      // 导出excel
      exportProjectExcel () {
        this.excelVisible = true
        this.$nextTick(() => {
          this.$refs.projectExcel.init(this.dataForm)
        })
      }
    }
  }
</script>

<style lang="scss" scoped>
  @import "src/assets/scss/_variables.scss";
  .box-card /deep/ .el-card__header {
    padding: 10px 25px;
  }
  .date_type{
    width: 140px;
  }
  .date_type /deep/ .el-input__inner {
    color: $--color-primary;
    font-weight: bolder;

  }

  .choose_header span {
    font-weight: 700;
    color: rgba($--color-primary,0.8);
  }
  .pro_popover {
    background-color:#f0f0f0;
    font-weight: 700;
    border:1px solid $--color-primary;
    color: gray;
  }
  .pro_popover span {
    color: #0bb2d4;
    font-weight: 300;
  }

  .proclass {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }

  .quality_btn {
    background-color: #006F94;
    color: white;
  }

  .qualityauth_btn {
    background-color: #3ec27c;
    color: white;
  }

  .output_btn {
    background-color: #785794;
    color: white;
  }

  .examine_btn {
    background-color: #32947e;
    color: white;
  }
  .expach_btn {
    background-color: #c42c8c;
    color: white;
  }
  .filarch_btn {
    background-color: #031a5a;
    color: white;
  }
  .select_btn {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }

  .quality_card{
    margin-top: 15px;
  }
  .quality_card .quality_card_title{
    font-weight: 700;
    font-size: 13pt;
    border-bottom: 1px solid #00a0e93f;
  }
  .quality_report{
    overflow: auto;
    padding: 8px;
  }
  .anim_not_view{
    opacity: 0;
  }
  /* 下拉动画 */
  .anim_report_view{
    display: block;
    animation:2s report_view 0s;
  }

  @keyframes report_view{
    0%{opacity:0}
    50%{opacity:.8;}
    100%{opacity:0;}
  }
</style>
